<template>
  <div class="main">
    <iframe class="iframe-panel" scrolling="no" :src="iframeUrl" />
  </div>
</template>

<script>
import axios from "axios";
export default {
  data() {
    return {
      // baseUrl: process.env.VUE_APP_BASE_API,
      baseUrl: "",
      iframeUrl: "",
    };
  },
  computed: {
    // routerInfo() {
    //   return this.$store.getters.routerInfo
    // }
  },
  created() {
    // this.getIframeUrl();
    this.getBaseUrl();
  },
  methods: {
    getBaseUrl() {
      // 暴露接口地址，供后端配置
      console.dir(document.location.hostname, "document");
      // axios.get("/front-finbuv/config.json").then((res) => {
      axios
        .get(`${process.env.VUE_APP_FRONt_BASE_URL}/config.json`)
        .then((res) => {
          if (res.data.ismust) {
            this.baseUrl = res.data.BASE_URL;
          } else {
            this.baseUrl =
              // "http://" + document.location.hostname + ":9080/finbuv";
              "http://" + document.location.hostname + ":8080/hermes";
          }
          const currentRoute = this.$route;
          this.iframeUrl = this.baseUrl + "/" + currentRoute.meta.url;
        });
    },
    getIframeUrl() {
      const currentRoute = this.$route;
      this.iframeUrl = this.baseUrl + "/" + currentRoute.meta.url;
    },
  },
};
</script>

<style lang="scss" scoped>
.main {
  height: 100%;
  // display: grid;
  // grid-template-rows: minmax(120px, 18%) minmax(500px, 80%);
  // grid-template-columns: 100%;
  // grid-gap: 3%;
  color: #fff;
  .iframe-panel {
    border: none;
    // background: #fff;
    width: 100%;
    height: 90%;
    min-height: 675px;
  }
}
</style>
